<template>
    <view class="content">
<view class="card">
      <u-form>
        <u-form-item label="头像">
          	<u-upload
          		:fileList="fileList1"
          		@afterRead="afterRead"
          		@delete="deletePic"
          		name="1"
                multiple
          		:maxCount="1"
          	></u-upload>
        </u-form-item>
        <u-line />
        <u-form-item label="姓名">
          <u-input v-model="name" />
        </u-form-item>
        <u-line />
        <u-form-item label="登录名">
          <u-input v-model="loginName" />
        </u-form-item>
        <u-line />
        <u-form-item label="电子邮件">
          <u-input v-model="email" />
        </u-form-item>
        <u-line />
        <u-form-item label="电话">
          <u-input v-model="phone" />
        </u-form-item>
        <u-line />
        <u-form-item label="年龄">
          <u-input v-model="age" />
        </u-form-item>
        <u-button type="primary" @click="saveUser">保存</u-button>
      </u-form>
    </view>
    </view>
  </template>
  
  <script>
  // Import axios library
  
  export default {
    onload(a){

    },
    data() {
      return {
          fileList1:[],
        // Initialize variables for employee information
        avatar: null,
        name: '',
        loginName: '',
        email: '',
        phone: '',
        age: ''
      }
    },
    methods: {
        deletePic(event) {
        				this[`fileList${event.name}`].splice(event.index, 1)
        			},
                    		async afterRead(event) {
                    				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
                    				let lists = [].concat(event.file)
                    				let fileListLen = this[`fileList${event.name}`].length
                    				lists.map(async (item) => {
                    					this[`fileList${event.name}`].push({
                    						...item,
                    					})
                                        
                                        this.avatar = await new Promise((resolve,reject) => {
                                        	fetch(item.url).then((response) => response.blob()).then((res) => {
                                        	  
                                        	        let blod = new Blob([res]);
                                        	       resolve(blod)
                                        	    });
                                        })
                                        console.log(this.avatar)
                    				})
                    				// for (let i = 0; i < lists.length; i++) {
                    				// 	const result = await this.uploadFilePromise(lists[i].url)
                    				// 	let item = this[`fileList${event.name}`][fileListLen]
                    				// 	this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
                    				// 		status: 'success',
                    				// 		message: '',
                    				// 		url: result
                    				// 	}))
                    				// 	fileListLen++
                    				// }
                    			},
      saveUser() {
        // Create a new FormData object
        let formData = new FormData();
        // Append employee information to the FormData object
        console.log(this.avatar)
        formData.append('avatar', this.avatar,Math.round(Math.random()*100)+'.jpg');
        formData.append('userName', this.name);
        formData.append('loginName', this.loginName);
        formData.append('email', this.email);
        formData.append('phone', this.phone);
        formData.append('age', this.age);
        // Send a POST request to the specified URL using axios
        this.$axios.post('http://localhost:8989/sysUser/saveUser', formData)
          .then(response => {
            console.log(response);
            if(response.data.flag){
              uni.showToast({
      title: '请到电脑端进行授权', // Show authorization message
      icon: 'none'
    })
    setTimeout(function(){
      uni.navigateBack()
    },1000)
            }
          })
          .catch(error => {
            console.log(error);
          });
      }
    }
  }
  </script>

<style>
.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  background-color: white; // Set background color of card to white
  padding: 10px; /* Add 10px of padding to the card */
  margin: 10px; /* Add 10px of margin to the card */

}
</style>

